<template>
    <view>
		<u-navbar height="60" bgColor="#0081ff">
			<!-- #ifdef MP-WEIXIN -->
			<view class="u-nav-slot margin-top-xl" slot="left">
			</view>
			<!-- #endif -->
			<view slot="center" class="u-nav-slot">
				<view style=" font-size: 20px;">图标设置</view>
			</view>
		</u-navbar>

        <view class="grid col-4 justify-center align-center ">
            <view class="solids my-image margin-sm shadow-blur align-center"
             style="width: 11vh;" v-for="(item,index) in iconList"
                :key="index">
                <image class="my-image" :src="imgUrl + item.imagePath" @tap="setImage(item.imagePath)"></image>
            </view>
        </view>

    </view>
</template>

<script>
    export default {
        data() {
            return {
				imgUrl: this.imgUrl,
                id: null,
				deviceId: null,
                type: null,
                iconList: []
            }
        },
        onLoad(option) {
            this.id = option.id
            this.deviceId = option.deviceId || null
            this.type = option.type
            this.$http.request({
                url:  'app/image/listAll',
                method: 'GET',
                success: (data) => {
                    if (data.data && data.data.code == 0) {
                        this.iconList = data.data.list
                    }
                }
            })
        },
        methods: {
            setImage(imagePath) {
				if(this.deviceId != null){
					this.$http.request({
					    url:  'app/device/updateImage',
					    method: 'POST',
					    data: {
					        "deviceId": this.deviceId,
					        "image": imagePath
					    },
					    success: (data) => {
					        if (data.data && data.data.code == 0) {
					          uni.navigateBack({
					              delta: 1
					          })
					        }
					    }
					})
				}
                // 1 为按钮
                if (this.type == 1) {
                    this.$http.request({
                        url:  'app/button/updateImage',
                        method: 'POST',
                        data: {
                            "buttonId": this.id,
                            "image": imagePath
                        },
                        success: (data) => {
                            if (data.data && data.data.code == 0) {
                                uni.navigateBack({
                                    delta: 1
                                })
                            }
                        }
                    })
                }
            },
        }
    }
</script>

<style>
    .my-image {
        width: 10vh;
        height: 10vh;
        align-items: center;
    }
</style>
